<template>
  <auto-design-data-list-table v-if="showListTable" :queryDesformCode="desformCode" :customButtonsAuth="buttonsAuth">
    <template #buttonBefore>
      <span style="color:#060606">请选择工单： </span>
      <a-select
          v-model="desformCode"
          class="search-input"
          showSearch
          :showArrow="false"
          :options="desFormOptions"
          placeholder="搜索表单"
          optionFilterProp="children"
          :filterOption="filterOption"
          @change="onDesformChange">
      </a-select>
    </template>
  </auto-design-data-list-table>
</template>

<script>
  import AutoDesignDataListTable from './AutoDesignDataListTable'
  import {initDictOptions} from '@/components/dict/JDictSelectUtil'

  export default {
    name: 'AutoDesignDataQuery',
    components: { AutoDesignDataListTable },
    data() {
      return {
        reloading: false,
        desformCode: '',
        desFormOptions: [],
        buttonsAuth: {
          detail: true,
          superQuery: true,
          customColumn: true,
        },
      }
    },
    computed: {
      showListTable() {
        return this.desformCode && !this.reloading
      },
    },
    created() {
      this.initDictConfig()
    },
    methods: {
      //初始化字典 - 表单数据
      async initDictConfig() {
        let res = await initDictOptions('design_form,desform_name,desform_code,desform_type=1')
        if (res.success) {
          this.desFormOptions = res.result
          let code = this.desFormOptions[0].value
          this.onDesformChange(code)
        }
      },
      // 刷新表格
      async reload() {
        this.reloading = true
        await this.$nextTick()
        this.reloading = false
        await this.$nextTick()
      },
      onDesformChange(code){
        this.desformCode = code;
        this.reload()
      },
      filterOption(input, option) {
        return option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0
      }
    }
  }
</script>
<style lang="less" scoped>
  .table-operator .search-input {
    width: 180px;
    margin-right: 8px;
  }
</style>
